<template>
	<view>
		<view class="wrap-swiper">
			<u-swiper height="280" :list="swiperList" @click="goSwiperUrl(swiperList)"
				@change="changeSwiper"></u-swiper>
			<u-grid :col="4" :border="false" class="common-grid">
				<u-grid-item v-for="(item,index) in commonList" :key="index" @click="goCommonView(item.url)">
					<u-avatar :size="106" :src='item.iconName'></u-avatar>
					<view class="grid-text">{{item.title}}</view>
				</u-grid-item>
			</u-grid>
		</view>
	</view>

</template>
<script>
	export default {
		props: {
			swiperList: {
				type: Array,
				required: true
			},
			commonList: {
				type: Array,
				required: true
			}
		},
		data() {
			return {
				swiperIndex: 0,
			}
		},

		methods: {
			navTo(url) {
				uni.reLaunch({
					url: "/pages/sys/index/navigavtion"
				});
				uni.removeStorageSync('navId');
			},

			goSwiperUrl(list) {
				let url = list[this.swiperIndex].url
				let id = list[this.swiperIndex].id
				uni.navigateTo({
					url: `${url}?id=${id}`
				})
			},
			changeSwiper(e) {
				this.swiperIndex = e
			},

			goCommonView(url) {
				if (url.includes("/pages/sys/upkeep/index")) {
					uni.switchTab({
						url: url
					})
				} else {
					uni.navigateTo({
						url: url
					})
				}
			},
		}
	};
</script>
<style lang="scss">
	@import '@/pages/sys/index/index/styles/sqiperMain.scss';
</style>